{{define "settings"}}
<div class="wrapper">
 <div class="row">
  <div class="col-xs-15 col-md-8 col-lg-8 notication-col center-block">
    {{range .FlashError}}<div class="well well-notification  orange-notification">{{.}}</div>{{end}}
    {{range .FlashSuccess}}<div class="well well-notification green-notification">{{.}}</div>{{end}}
  </div>

  <div class="col-sm-15 col-md-10 text-left center-block">
      {{if .ShowInstructions }}
      <p><strong>To start staking, you need to submit a public key address.  This can be
      done automatically by the GUI wallet Decrediton (see below).
      You may also proceed by following the command-line instructions on the
      <a href="/address">Address Page</a>.</strong></p><br>
      {{end}}
        <p><strong>The official Decred GUI wallet
        <a href="https://decred.org/downloads/#decrediton">Decrediton</a>
        is the recommended way to use voting services.  All you need to get started
        is to copy and paste the API Token below when prompted.  A more
        comprehensive guide is available for
        <a href="https://docs.decred.org/getting-started/user-guides/decrediton-setup/">Decrediton</a>.
        There is also a more general overview of the staking process available
				<a href="https://docs.decred.org/mining/proof-of-stake/#automatic-purchasing-of-tickets" target="_blank" rel="noopener noreferrer">here</a>.</strong></p>
  </div>

  <div class="col-sm-15 col-md-10 text-left center-block">
    <h1>Settings</h1>
 
    <p><strong>API Token:</strong></p>
    <pre>{{ .APIToken }}</pre>
    <hr />

    <h2>Change Email Address</h2>
    {{if .CaptchaDone}}
    <form method="post" class="form-horizontal">
      <div class="form-group">
        <label class="control-label col-sm-2" for="email">New Email:</label>
        <div class="col-sm-13">
          <input id="email" name="email" placeholder="New Email Address" type="email" class="form-control" required>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2" for="emailpassword">Password:</label>
        <div class="col-sm-13">
          <input id="emailpassword" name="password" placeholder="Password" type="password" class="form-control" required>
        </div>
      </div>
      <div class="form-group">
            <button id="updateEmail" name="updateEmail" value="true" class="btn btn-primary">Change Email Address</button>
      </div>
      <input type="hidden" name="{{.CsrfKey}}" value={{.CsrfToken}}>
    </form>
    {{else}}
      <p>To change your email address, first complete the captcha:</p>
      {{ template "captcha" . }}
    {{end}}

    <hr />
    <h2>Change Password</h2>
    <form class="form-horizontal" method="post">
      <div class="form-group">
        <label for="curpassword" class="control-label col-sm-2">Current<br />Password</label>
        <div class="col-sm-13">
          <input id="curpassword" name="password" type="password" placeholder="Current Password" class="form-control" required>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2" for="newpassword">New<br />Password</label>
        <div class="col-sm-13">
          <input id="newpassword" name="newpassword" type="password" placeholder="New Password" class="form-control" required>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2" for="newpasswordrepeat">Repeat New Password</label>
        <div class="col-sm-13">
          <input id="newpasswordrepeat" name="newpasswordrepeat" type="password" placeholder="Repeat New Password" class="form-control" required>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label" for="updatepassword"></label>
        <button id="updatepassword" name="updatePassword" value="true" class="btn btn-primary">Update Password</button>
      </div>
      <input type="hidden" name="{{.CsrfKey}}" value={{.CsrfToken}}>
    </form>
  </div> <!-- forms column -->
 </div> <!-- row -->
</div> <!-- wrapper -->
{{end}}

